// import ReactDOM from 'react-dom';
import React from 'react';
import './tab.css'


class Tab  extends React.Component {


  state = {
    activeIndex : 1
  }

  tabClick = (e)=>{
    console.log(this);
    console.log(e.target.dataset.index);
    let index = e.target.dataset.index
   

  }
  render(){

    return(
      <div>
        <div>
          <button onClick={this.tabClick} data-index={1} >选项1</button>
          <button onClick={this.tabClick} data-index={2} >选项2</button>
        </div>
       {/*  <div className={"content" + this.state.activeIndex === 1 ? 'active':''}>
          我是1的内容
        </div>
        <div className={"content" + this.state.activeIndex === 2 ? 'active':''}>
          我是2的内容
        </div> */}

        
        <div className={"content " + (this.state.activeIndex === 1 ? 'active':'')}>
          我是1的内容{this.state.activeIndex}
        </div>
        <div className={"content " + (this.state.activeIndex === 2 ? 'active':'')}>
          我是2的内容
        </div>
      </div>
    )
  }
}



export default Tab
